<template>
  <div style="height:100%">
    <el-breadcrumb separator-class="el-icon-arrow-right" class="breadcrumb-base" style="line-height: 30px">
      <el-breadcrumb-item>
        <i class="el-icon-s-platform"></i>
        自动扫描
      </el-breadcrumb-item>
    </el-breadcrumb>

    <div class="main-container" v-if="!isLoading">
      <el-row>
        <el-tabs v-model="typeActiveTab" type="card">
          <el-tab-pane label="未上传" name="TabNoUpload">
            <span slot="label">
              未上传
              <el-badge v-if="biopsyState.noUpload > 0" :value="biopsyState.noUpload"
                class="tab-content-badge"></el-badge>
            </span>
            <tab-no-upload v-if="typeActiveTab === 'TabNoUpload'"
              @DiagnosisScanMethed="biopsyStateRequestDiagnosisScan"></tab-no-upload>
          </el-tab-pane>
          <el-tab-pane label="未匹配" name="TabUnMatched">
            <span slot="label">
              未匹配
              <el-badge v-if="biopsyState.unMatch > 0" :value="biopsyState.unMatch"
                class="tab-content-badge"></el-badge>
            </span>
            <tab-un-matched v-if="typeActiveTab === 'TabUnMatched'"
              @getAngelCount="biopsyStateRequest"></tab-un-matched>
          </el-tab-pane>
          <el-tab-pane label="已匹配" name="TabMatched">
            <span slot="label">
              已匹配
              <el-badge v-if="biopsyState.matched > 0" :value="biopsyState.matched"
                class="tab-content-badge"></el-badge>
            </span>
            <tab-matched v-if="typeActiveTab === 'TabMatched'" @getAngelCount="biopsyStateRequest"></tab-matched>
          </el-tab-pane>
          <el-tab-pane label="AI分析监控" name="TabAiMonitoring">
            <tab-ai-monitoring v-if="typeActiveTab === 'TabAiMonitoring'"></tab-ai-monitoring>
          </el-tab-pane>
          <el-tab-pane label="NLP分析监控" name="TabNlpMonitoring">
            <tab-nlp-monitoring v-if="typeActiveTab === 'TabNlpMonitoring'"></tab-nlp-monitoring>
          </el-tab-pane>
          <el-tab-pane label="扫描统计" name="TabStatistics">
            <tab-statistics v-if="typeActiveTab === 'TabStatistics'"></tab-statistics>
          </el-tab-pane>
          <el-tab-pane label="在线监控" name="TabMonitoring">
            <tab-monitoring v-if="typeActiveTab === 'TabMonitoring'"></tab-monitoring>
          </el-tab-pane>
          <!--          <el-tab-pane label="扫描仪管理" name="TabManagement">-->
          <!--            <tab-management-->
          <!--              v-if="typeActiveTab === 'TabManagement'"-->
          <!--            ></tab-management>-->
          <!--          </el-tab-pane>-->
        </el-tabs>
      </el-row>
    </div>
   
  </div>
</template>

<script>
import TabNoUpload from './DiagnosisScanNoUpload';
import TabUnMatched from './DiagnosisScanUnMatched';
import TabMatched from './DiagnosisScanMatched';
import TabStatistics from './DiagnosisScanStatistics';
import TabAiMonitoring from './DiagnosisScanAiMonitoring';
import TabNlpMonitoring from './DiagnosisScanNlpMonitoring';
import TabMonitoring from './DiagnosisScanMonitoring';
import TabManagement from './DiagnosisScannerManagement'


export default {
  name: 'DiagnosisScan',
  components: {
    TabNoUpload,
    TabUnMatched,
    TabMatched,
    TabStatistics,
    TabMonitoring,
    TabAiMonitoring,
    TabNlpMonitoring,
    TabManagement,
  },
  data() {
    return {
      thisScanID: '',
      typeActiveTab: 'TabNoUpload',
      isLoading:true,
      isMounted: false,
      biopsyState: {
        noUpload: 0,
        uploading: 0,
        uploaded: 0,
        unMatch: 0, //未匹配
        matched: 0, //已匹配
      },
    };
  },
  mounted() {
    this.screenFull();
    const { state } = this.$store;
    if (state.sliceOverview && state.sliceOverview.sampleOrganId) {
      this.typeActiveTab = 'TabMatched';
    }
   
    let query = this.$route.query
    let that = this
    if (query && query.from == 'eworld') {// 调用免登录token   console.log(query)
    
    this.goto()
    window.addEventListener('message', e => {
      let datas=e.data.message
      let params=datas.params
      console.log('明天父页面传输过来参数', e.data);
      if(params.Authorization){
        if(!this.isMounted){
          that.goLogin(params.Authorization, params.SystemId,params.sub)
       } 
      }else{
        alert("eworldIframePisToken返回值异常~")
      }
    });

    }else{
      this.isLoading=false
      this.thisScanStatusRequest();
       this.biopsyStateRequest();
    }


  },
  
  methods: {
    goto() {
         if( window.parent){
          window.parent.postMessage({ message: { from: 'aikeji', operate: 'eworldIframePisToken' } }, '*')
         }  
        },
    async goLogin(mtywToken, systemId,subNum) {
      try {
        let _this = this;
        await this.$axios({
          method: 'POST',
          url: '/PROXY-Remote/mTYW/login',
          params: {
            mtywToken: mtywToken,
            systemId: systemId,
            sub:subNum
          },
        })
          .then((res) => {


            if (res.data.code === 200) {
              // 请求成功
              const result = res.data.data;
              const platform = {
                name: '浦东医院病理平台',
              };
              const user = {
                id: result.userInfo.id,
                name: result.userInfo.name,
                headImgUrl: result.userInfo.headUrl,
              };
              const permissionList = result['ui-item'];
              // console.log('permissionList-before', permissionList);
              for (let init = 0; init < permissionList.length; init++) {
                for (
                  let i = 0;
                  i < permissionList[init].permissionList.length;
                  i++
                ) {
                  const iconString = permissionList[init].permissionList[i].icon;
                  const [prefix, icon] = _.split(iconString, ' ');
                  permissionList[init].permissionList[i].prefix = prefix;
                  permissionList[init].permissionList[i].icon = icon;
                }
              }
              // console.log('permissionList-after', permissionList);
              // 存储缓存数据
              this.$store.commit('setPlatform', platform);
              this.$store.commit('setUser', user);
              this.$store.commit('setPermissionList', permissionList);
              this.$store.commit('loginTimeFlash');
              _this.isLoading=false
              _this.thisScanStatusRequest();
              _this.biopsyStateRequest();
            
            }
          });
      } catch (e) {
        this.$message.error(e.message);
      }
    },
    //mTYW/login
    screenFull() {
      if (this.$store.state.fullScreen) {
        if (
          !document.fullscreenElement &&
          !document.msFullscreenElement &&
          !document.mozFullScreenElement &&
          !document.webkitFullscreenElement
        ) {
          let docElm = document.documentElement;
          if (docElm.requestFullscreen) {
            docElm.requestFullscreen();
          } else if (docElm.msRequestFullscreen) {
            // IE
            docElm = document.body; // overwrite the element (for IE)
            docElm.msRequestFullscreen();
          } else if (docElm.mozRequestFullScreen) {
            // 火狐
            docElm.mozRequestFullScreen();
          } else if (docElm.webkitRequestFullScreen) {
            // 谷歌
            docElm.webkitRequestFullScreen();
          }
          //设置是否全屏
          this.$store.commit('fullScreenChange', false);
        }
      }
    },
    biopsyStateRequestDiagnosisScan() {
      this.biopsyStateRequest();
    },
    thisScanStatusRequest() {
      const scanStatus = {
        isUploading: 0,
        biopsyHistoryId: '',
      };

      this.$store.commit('setPropertyGeneral', {
        key: 'scanStatus',
        value: scanStatus,
      });
    },
    async biopsyStateRequest() {
      try {
        await this.$axios({
          method: 'GET',
          url: '/PROXY-Remote/biopsy/count',
        }).then((res, err) => {
          if (res.data.code !== 200) {
            throw new Error(err);
          }
          res.data.data.forEach((item) => {
            if (_.get(item, 'current_level', 0) === 1) {
              this.biopsyState.noUpload = _.get(item, 'count', 0);
            }
            if (_.get(item, 'current_level', 0) === 2) {
              this.biopsyState.uploading = _.get(item, 'count', 0);
            }
            if (_.get(item, 'current_level', 0) === 3) {
              this.biopsyState.uploaded = _.get(item, 'count', 0);
            }
            if (_.get(item, 'current_level', 0) === 4) {
              this.biopsyState.unMatch = _.get(item, 'count', 0);
            }
            if (_.get(item, 'current_level', 0) === 5) {
              this.biopsyState.matched = _.get(item, 'count', 0);
            }
          });
        });
      } catch (e) {
        throw new Error(e);
      }
    },
  },
};
</script>

<style scoped>
.tab-content-badge {
  top: 3px;
}
</style>
